<template>
  <div>
    <sm-viewer>
      <sm3d-measure></sm3d-measure>
    </sm-viewer>
  </div>
</template>

<script>
export default {
  data() {
    return {};
  },
  props: {
    sceneUrl: {
      type: String,
      default: "",
    },
  },
  mounted() {
    this.configS();
    this.pickClick();
  },
  methods: {
    configS() {
      // 取消默认的双击事件
      viewer.cesiumWidget.screenSpaceEventHandler.removeInputAction(
        Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK
      );
      // 抗锯齿
      viewer.scene.postProcessStages.fxaa.enabled = false;
      // 水雾特效
      viewer.scene.globe.showGroundAtmosphere = true;
      // 设置最大俯仰角，[-90,0]区间内，默认为-30，单位弧度
      viewer.scene.screenSpaceCameraController.constrainedPitch =
        Cesium.Math.toRadians(-20);
      // 倾斜视图 鼠标左键旋转
      viewer.scene.screenSpaceCameraController.tiltEventTypes = [
        Cesium.CameraEventType.RIGHT_DRAG,
      ];
      // 缩放设置 重新设置缩放成员
      viewer.scene.screenSpaceCameraController.zoomEventTypes = [
        Cesium.CameraEventType.MIDDLE_DRAG,
        Cesium.CameraEventType.WHEEL,
        Cesium.CameraEventType.PINCH,
      ];
      viewer.scene.screenSpaceCameraController.rotateEventTypes = [
        Cesium.CameraEventType.LEFT_DRAG,
      ];
    },
    openScene() {
      viewer.scene.layers.removeAll();
      scene.open(this.sceneUrl);
    },
    addMap1() {
      // viewer.imageryLayers.addImageryProvider(
      //   new Cesium.TiandituImageryProvider({
      //     credit: new Cesium.Credit("https://t{s}.tianditu.gov.cn/DataServer"),
      //     token: "9ae78c51a0a28f06444d541148496e36",
      //   })
      // );
      //加载地形
      viewer.terrainProvider = new Cesium.CesiumTerrainProvider({
        url: "http://data.mars3d.cn/terrain",
        requestWaterMask: true,
        requestVertexNormals: true,
        isSct: false,
      });
    },
    addMap2() {
      viewer.imageryLayers.addImageryProvider(
        new Cesium.MapboxStyleImageryProvider({
          url: "https://api.mapbox.com/styles/v1",
          username: "marsgis",
          styleId: "cki0a2mtc2vyo1bqu76p8ks8m",
          accessToken:
            "pk.eyJ1IjoibWFyc2dpcyIsImEiOiJja2Fod2xlanIwNjJzMnhvMXBkMnNqcjVpIn0.WnxikCaN2KV_zn9tLZO77A",
          scaleFactor: true,
        })
      );
      viewer.terrainProvider = new Cesium.EllipsoidTerrainProvider({});
    },
    addIcons(icons) {
      viewer.entities.removeAll();
      for (const ico of icons) {
        // viewer.entities.removeById(ico.id);
        this.setIco(ico.position, ico.icon, ico.name, ico.id);
      }
    },
    setIco(position, image, name, id) {
      viewer.entities.add({
        position: Cesium.Cartesian3.fromDegrees(
          position.x,
          position.y,
          position.z
        ),
        show: true,
        id: id,
        billboard: {
          image,
          color: Cesium.Color.WHITE.withAlpha(1),
          height: 27,
          width: 20,
          rotation: 0,
          sizeInMeters: false,
          verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
          horizontalOrigin: Cesium.HorizontalOrigin.CENTER,
          pixelOffset: new Cesium.Cartesian2(0, 10),
          scale: 1.0,
          show: true,
          distanceDisplayCondition: new Cesium.DistanceDisplayCondition(
            0,
            40000
          ),
          disableDepthTestDistance: Number.POSITIVE_INFINITY,
        },
        label: {
          text: name,
          font: "normal 12px MicroSoft YaHei",
          scale: 1,
          style: Cesium.LabelStyle.FILL,
          fillColor: Cesium.Color.fromCssColorString("rgba(255,255,255, 1.0)"),
          verticalOrigin: Cesium.VerticalOrigin.BOTTOM,
          pixelOffset: new Cesium.Cartesian2(0, -20),
          showBackground: true,
          backgroundColor: Cesium.Color.fromCssColorString("rgba(0,0,0, 0.5)"),
          distanceDisplayCondition: new Cesium.DistanceDisplayCondition(
            0,
            40000
          ),
        },
      });
    },
    pickClick() {
      let handlers = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas);
      handlers.setInputAction((movement) => {
        let pick = viewer.scene.pick(movement.position);
        if (Cesium.defined(pick) && pick.id._billboard != undefined) {
          if (
            pick.id.billboard._image._value ==
            require("assets/img/map/ico2.png")
          ) {
            this.$emit("openImg");
          } else if (
            pick.id.billboard._image._value == require("assets/img/map/ico.png")
          ) {
            this.$emit("showvr", pick.id._id);
          }
        }
      }, Cesium.ScreenSpaceEventType.LEFT_CLICK);
    },
    lookto(position, heading, pitch, roll) {
      scene.camera.setView({
        destination: position,
        orientation: {
          heading,
          pitch,
          roll,
        },
      });
    },
    lookfly(position, heading, pitch, roll) {
      viewer.camera.flyTo({
        destination: position,
        duration: 5,
      });
      setTimeout(() => {
        viewer.camera.flyTo({
          destination: position,
          orientation: {
            heading,
            pitch,
            roll,
          },
          duration: 5,
        });
      }, 4800);
    },
  },
  watch: {
    sceneUrl(val) {
      this.openScene();
      // this.lookto(
      //   {
      //     x: -2193309.816798971,
      //     y: 4173923.358545551,
      //     z: 4302385.731224303,
      //   },
      //   6.256739508155098,
      //   -0.6296448310731169,
      //   6.283185307179586
      // );
    },
  },
};
</script>
<style scoped>
#cesiumContainer {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  margin: 0;
  overflow: hidden;
  padding: 0;
  font-family: sans-serif;
}
</style>